<gm:page title="Doug's Map Wiki" authenticate="true">

  <!--
    The map wiki application demonstrates the the ability to use the 
    map object to create wiki like experience for maps.
    @author: GME Team
  -->

  <div class="gm-app-header">
    <h1>Doug's Map Wiki</h1>
    This is Doug's map wiki
  </div>
  
  <gm:map id="myMap" data="${myList}" control="large" infoTemplate="myMapDetailsTemplate"
    width="700px" height="500px" lat="51.4934" lng="-0.1487" zoom="15" create="true">
    <gm:handleEvent src="myList" />
  </gm:map>
        
  <gm:list id="myList" data="${app}/markers" template="myListTemplate">
    <gm:handleEvent src="myMap" />
  </gm:list>
  
    <gm:template id="myMapDetailsTemplate">
    <table style="width:300px">
      <tr>
        <td><gm:text ref="atom:title"/></td>
      </tr>
      <tr>
        <td><gm:textarea ref="atom:content"/></td>
      </tr>
      <tr>
        <td><gm:editButtons editonly="true" text="true"/></td>
      </tr>
    </table>
  </gm:template>
  
  <gm:template id="myListTemplate">
    <table class="blue-theme">
      <thead>
        <tr>
          <td style="width:40px"></td>
          <td style="width:70px">Name</td>
          <td style="width:45px"></td>
        </tr>
      </thead>
      <tfoot>
        <tr>
          <td colspan="2"><gm:pager /></td>
          <td><gm:create label="Add" /></td>
        </tr>
      </tfoot>
      <tbody repeat="true">
        <tr>
          <td><gm:toggle /></td>
          <td><gm:text ref="atom:title" hint="Enter title" /></td>
          <td><gm:editButtons/></td>
        </tr>
      </tbody>
    </table>    
  </gm:template>
  
  </gm:page>
